<ion-header *ngIf="ifOrderType">
  <ion-toolbar color="winter" class="b-b-light">
    <!-- <ion-buttons left>
      <button (click)="goBack()" ion-button icon-only>
        <ion-icon name="arrow-back"></ion-icon>
      </button>
    </ion-buttons> -->
    <ion-searchbar placeholder="搜索商品名称、编号" (click)="goSearch()"></ion-searchbar>
    <ion-buttons right>
      <button (click)="goCart()" ion-button icon-only>
        <i class="iconfont cart f-2">&#xe633;</i>
      </button>
    </ion-buttons>
  </ion-toolbar>
  <ion-toolbar color="winter">
    <div class="tab-wrap" no-padding>
      <div class="type-all">
        <span *ngFor="let item of orderTypes; let num = index">
          <span  (click)="segmentChanged(item.VALUE_CODE)" [ngClass]="{'order-type':true,'act':parentTab == item.VALUE_CODE}">{{item.VALUE_TITLE}}</span>
        </span>
      </div>
    </div>
  </ion-toolbar>

</ion-header>
<ion-content class="content-primary">
  <!--refresher-->
  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉刷新" refreshingSpinner="circles" refreshingText="加载中...">
    </ion-refresher-content>
  </ion-refresher>
  <div class="menu" *ngIf="ifOrderType">
    <div class="directory">
      <ul>
        <li [ngClass]="{'active': type.VALUE_CODE == currentType}" *ngFor="let type of typeList;let i=index;" (click)="changeType(type.VALUE_CODE)">{{type.VALUE_TITLE}}</li>
      </ul>
    </div>
    <div class="content-wrap">

      <!-- good -->
      <ion-grid *ngFor="let item of items;let i=index;" class='cart-main'>
        <ion-row>
          <ion-col class="goods-img" no-padding (click)="goGoodsDetail(item)" col-4>
            <img [src]="imgUrl+item.IMAGE_LINK" onerror='this.src="assets/img/null-img.png"' class="pic">
          </ion-col>
          <ion-col class="goods-info" no-padding>
            <ion-row>
              <ion-col class="goods-name" no-padding col-12 class='p-l-0'>
                <span (click)="goGoodsDetail(item)" class="name">
                  <i *ngIf="item.PRODUCT_CATEGORY == 18" class="f-1-5 iconfont text-green-blue">&#xe689;</i>&nbsp;{{item.PRODUCT_NAME}}
                </span>
              </ion-col>
              <ion-col cno-padding col-12 class='p-l-0 goods-pv'>
                <span class="pv">
                  PV: +${{parentTab == '30' ? item.MP_PV : item.FP_PV}}
                </span>
              </ion-col>
            </ion-row>
            <ion-row>
              <ion-col no-padding col-6 class='text-red goods-price'>
                &yen;&nbsp;{{parentTab == '30' ? item.MP_PRICE : item.FP_PRICE}}
              </ion-col>
              <ion-col no-padding col-6 class='p-0 goods-cart' text-right>
                <i (click)="addCart(item)" class="iconfont i-add">&#xe63b;</i>
              </ion-col>
            </ion-row>
          </ion-col>
        </ion-row>
      </ion-grid>

      <!-- 套餐 -->
      <!-- <ion-grid class='cart-main'>
        <ion-row>
          <ion-col (click)="goGoodsDetail(1)" col-4>
            <img src="assets/img/goods1.png" class="pic">
          </ion-col>
          <ion-col>
            <ion-row>
              <ion-col col-12 class='p-l-0'>
                <span (click)="goGoodsDetail(1)" class="name">
                  隆力奇蛇油一号套餐
                </span>
              </ion-col>
              <ion-col col-12 class='p-l-0'>
                <span class="pv">
                  PV: +$0.45
                </span>
              </ion-col>
            </ion-row>
            <ion-row>
              <ion-col col-6 class='p-0 text-red price'>
                &yen;&nbsp;56
              </ion-col>
              <ion-col col-6 class='p-0' text-right>
                <i class="iconfont i-add">&#xe63b;</i>
              </ion-col>
            </ion-row>
          </ion-col>
        </ion-row>
      </ion-grid> -->

      <!--null data-->
      <div class="show-default" *ngIf="showNull">
        <img src="../../assets/img/bg_null_data.png">
        <p class="message">没有相关数据</p>
      </div>
      <!--上拉加载-->
      <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
        <ion-infinite-scroll-content></ion-infinite-scroll-content>
      </ion-infinite-scroll>

    </div>

  </div>

  <div class="show-default" *ngIf="!ifOrderType">
    <img src="../../assets/img/bg_null_data.png">
    <p class="message">商品列表为空</p>
  </div>
</ion-content>